<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="css/jquery.selectImg.css" />
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.selectImg.js"></script>
    <script>
        function select() {
            $("#selectItemDiv").selectImg(3, function (msg) {
                alert(msg);
            });
        }

        function cancel() {
            $("#selectItemDiv").cancelSelectImg();
        }
    </script>
</head>

<body>
    <div>
        <button onclick="select()">开始选择</button>
        <button onclick="cancel()">取消选择</button>
    </div>
    <div class="selectImg" id="selectItemDiv">
        <div class="imgItem">
            <div class="img_show">
                <img src="images/1.png" />
            </div>
            <div class="img_title">
                1.png
            </div>
            <div class="img_isCheck">
                <i class="glyphicon glyphicon-ok"></i>
            </div>
        </div>
        <div class="imgItem">
            <div class="img_show">
                <img src="images/2.png" />
            </div>
            <div class="img_title">
                2.png
            </div>
            <div class="img_isCheck">
                <i class="glyphicon glyphicon-ok"></i>
            </div>
        </div>
        <div class="imgItem">
            <div class="img_show">
                <img src="images/3.png" />
            </div>
            <div class="img_title">
                3.png
            </div>
            <div class="img_isCheck">
                <i class="glyphicon glyphicon-ok"></i>
            </div>
        </div>
        <div class="imgItem">
            <div class="img_show">
                <img src="images/4.png" />
            </div>
            <div class="img_title">
                4.png
            </div>
            <div class="img_isCheck">
                <i class="glyphicon glyphicon-ok"></i>
            </div>
        </div>
        <div class="imgItem">
            <div class="img_show">
                <img src="images/5.png" />
            </div>
            <div class="img_title">
                5.png
            </div>
            <div class="img_isCheck">
                <i class="glyphicon glyphicon-ok"></i>
            </div>
        </div>
        <div class="imgItem">
            <div class="img_show">
                <img src="images/6.png" />
            </div>
            <div class="img_title">
                6.png
            </div>
            <div class="img_isCheck">
                <i class="glyphicon glyphicon-ok"></i>
            </div>
        </div>
        <div class="imgItem">
            <div class="img_show">
                <img src="images/7.png" />
            </div>
            <div class="img_title">
                7.png
            </div>
            <div class="img_isCheck">
                <i class="glyphicon glyphicon-ok"></i>
            </div>
        </div>
    </div>
</body>

</html>
<script>
</script>